import React, { Component } from "react";
import propTypes from "prop-types";
export default class Banner extends Component {
  constructor(props) {
    // 这个props就是父组件传递过来的数据
    super(props); // 必须调用super才会在this上挂载props
    this.state = {};
  }
  /**
   constructor(props) { // 这个props就是父组件传递过来的数据
    super(props);  // 必须调用super才会在this上挂载props
    }
    如果不写constructor，那么react会默认帮你写一个constructor，并且会默认调用super(props)
   */
  render() {
    // console.log(this.props);
    // this.props  里面存放着父组件传递过来的数据
    const { list, title } = this.props;
    const renderList = () => {
      return list.map((item) => <li key={item}>{item}</li>);
    };
    return (
      <div>
        <div>这里是Banner组件</div>
        <span>{title}</span>
        <ul>{renderList()}</ul>
      </div>
    );
  }
}
// 参数限制
Banner.propTypes = {
  list: propTypes.array,
  title: propTypes.string,
};
// 默认值
Banner.defaultProps = {
  title: "默认标题",
  list: [],
}
